<script>
import { ElMessage } from 'element-plus';
import axios from 'axios';

export default {
  name: 'App',
  created() {
    // 全局错误处理
    this.setupErrorHandling();
  },
  methods: {
    setupErrorHandling() {
      // 全局处理API错误
      axios.interceptors.response.use(
        response => {
          return response;
        },
        error => {
          // 处理常见错误
          if (!error.response) {
            ElMessage.error('网络错误，请检查您的网络连接');
          } else {
            const status = error.response.status;
            
            switch (status) {
              case 400:
                ElMessage.error(error.response.data.message || '请求参数错误');
                break;
              case 401:
                ElMessage.error('您的登录已过期，请重新登录');
                localStorage.removeItem('token');
                localStorage.removeItem('isLogin');
                this.$router.push('/login');
                break;
              case 403:
                ElMessage.error('您没有权限执行此操作');
                break;
              case 404:
                ElMessage.error('请求的资源不存在');
                break;
              case 500:
                ElMessage.error('服务器内部错误，请稍后再试');
                break;
              default:
                ElMessage.error(`请求失败(${status}): ${error.response.data.message || '未知错误'}`);
            }
          }
          
          return Promise.reject(error);
        }
      );
    }
  }
};
</script>

<template>
  <router-view />
</template>

<style>
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html,
body,
#app {
  width: 100%;
  height: 100%;
}

.el-main {
  --el-main-padding: 0px;
}
</style>
